<template>
  <view class="viewport">
    <view class="header" :style="{ paddingTop: safeAreaInsets!.top + 'px' }">
      <view class="left icon-left" @tap="Onleft()"></view>
      <uni-title type="h1" align="center" title="定时记账" class="text"></uni-title>
    </view>
    <!-- 具体明细 -->
    <scroll-view enable-back-to-top scroll-y class="scroll">
      <view
        class="content"
        :class="{ notEnable: item.IsEnable === false }"
        v-for="item in data"
        :key="item.ID"
        @tap="OnEdit(item.ID)"
      >
        <view class="h2">{{ item.JobName }}</view>
        <view class="base">
          <view class="base">
            <view class="gray"> 创建人：</view>
            {{ item.UserName }}
          </view>
          <view class="base"> <view class="gray"> 执行时间：</view>{{ item.TriggerTime }}</view>
        </view>
        <view class="base">
          <view class="base"><view class="gray"> 周期：</view>{{ item.RepeateType }}</view>
          <view class="base"><view class="gray"> 记账类型：</view>{{ item.AccountType }}</view>
        </view>
        <view class="account">
          <view class="base"><view class="gray"> 账户来源：</view>{{ item.AccountFrom }}</view>
          <view class="base"><view class="gray"> 账户目标：</view>{{ item.AccountTo }}</view>
        </view>
        <view class="good">
          <view class="base"><view class="gray"> 商品类型：</view>{{ item.GoodsType }}</view>
          <view class="base"><view class="gray"> 商品：</view>{{ item.Goods }}</view>
        </view>
        <view class="good">
          <view class="base"><view class="gray"> 金额：</view>{{ item.Amount }}</view>
          <view>{{ item.Remark }}</view>
        </view>
      </view>
      <navigator class="icon-currency navigator" url="/pages/Job/JobDetail" hover-class="none">
        <button class="button btn">添加定时记账</button>
      </navigator>
    </scroll-view>
  </view>
</template>

<script setup lang="ts">
import { NoteAccountJobAPI } from '@/services/job'
import { useMemberStore } from '@/stores'
import type { GetNoteAccountJobResponse } from '@/types/job'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
// 获取会员信息
const memberStore = useMemberStore()
const data = ref<GetNoteAccountJobResponse[]>()
//加载初始化
onLoad(async () => {
  reFresh()
})
onShow(async () => {
  reFresh()
})
//刷新事件
const reFresh = async () => {
  if (memberStore.profile) {
    const res = await NoteAccountJobAPI({
      Auth: memberStore.profile.Token,
      UserGroup: memberStore.profile.UserGroup,
    })
    data.value = res.result
    uni.showToast({ icon: 'success', title: '刷新成功' })
  } else {
    uni.showToast({ icon: 'none', title: '请先登录' })
    setTimeout(() => {
      // 页面跳转
      uni.switchTab({ url: '/pages/my/my' })
    }, 500)
  }
}
//返回
const Onleft = () => {
  uni.switchTab({ url: '/pages/my/my' })
}
//返回
const OnEdit = (e: number) => {
  uni.navigateTo({ url: '/pages/Job/JobDetail?ID=' + e })
}
</script>

<style lang="scss">
@import './styles/Job.scss';
</style>
